<template>
  <div class="container">
    <!-- 选择偏好 -->
    <van-dialog
      use-slot
      :show="likeShow"
      :show-confirm-button="false"
      :close-on-click-overlay="true"
      @close="closeLike">
      <div class="selectLike">
        <h4>选择偏好</h4>
        <radio-group class="radio-group" @change="selectedLike">
          <label class="radio">
            <radio value="0" checked=""/>黄历解读
          </label>
           <label class="radio">
            <radio value="1"/>星座运势
          </label>
        </radio-group>
        <button type="warn" @click="confirmLike">确定</button>
      </div>
    </van-dialog>
    <div v-show="ifShow">
      <luck @changeShow="changeCon"></luck>
    </div>
    <div v-show="!ifShow">
      <constellation @changeShow="changeLottery"></constellation>
    </div>
  </div>
</template>
<script>
import Luck from '../../components/Luck'
import Constellation from '../../components/Constellation'

export default {
  components: {
    Luck,
    Constellation
  },
  data () {
    return {
      likeType: '0', // 偏好类型
      likeShow: false, // 偏好显隐
      ifShow: true, // 显示黄历或者星座
      num: 0, // 判断是否直接点击确认
      skipNum: 0
    }
  },
  onPageScroll () {
    wx.reportAnalytics('up_and_down_slide_conste', {
    })
  },
  onLoad () {
    this.likeShow = !wx.getStorageSync('likeType')
    this.ifShow = wx.getStorageSync('likeType') === '0'
  },
  onShow () {
    this.ifShow = wx.getStorageSync('likeType') === '0'
    if (this.ifShow) {
      wx.reportAnalytics('huang_li_exposre', {
      })
    }
  },
  // 微信分享
  onShareAppMessage (res) {
    if (res.from === 'menu') {
      return {
        title: '黄历解读',
        path: '/pages/calendar/main'
      }
    } else if (res.target.id === 'shareSuit') {
      return {
        title: '选择吉日',
        path: '/pages/calendar/main'
      }
    } else {
      return {
        title: '每日一签',
        path: '/pages/calendar/main'
      }
    }
  },
  methods: {
    // 关闭偏好弹框
    closeLike () {
      this.likeShow = false
    },
    // 选择偏好
    selectedLike (e) {
      this.likeType = e.target.value
      this.num++
    },
    // 确定偏好
    confirmLike () {
      this.likeShow = false
      this.ifShow = this.likeType === '0'
      wx.setStorageSync('likeType', this.likeType)
      if (this.likeType === '0') {
        wx.reportAnalytics('huang_li_exposre', {
        })
      }
      if (this.num === 0) {
        wx.reportAnalytics('first_click_confirmation', {
        })
      }
    },
    // 切换到显示星座
    changeCon (val) {
      this.ifShow = val
    },
    // 切换到显示黄历
    changeLottery (val) {
      this.ifShow = val
    }
  }
}
</script>
<style lang="scss" scoped>
.container {
  .selectLike {
    text-align: center;
    padding: 0 10px;
    h4 {
      margin: 10px 0;
      font-size: 18px;
      font-weight: bold;
    }
    button {
      margin: 10px 0;
    }
  }
}
</style>
